{% extends 'base.html' %}
	
{# Side Menu Options #}
{% ifequal action "Add" %}
	{% block sidebar %}
	<div class="sidebar">
		<h3>Menu</h3>
		<ul>
	    	<li><a href="/timelines/{{timeline_id}}/events/search">Alterar Data</a></li>
	  	</ul>
	</div>
	{% endblock %}
{% endifequal %}

{% block content %}
	<script>
		$("#events_menu").addClass("selected");
	</script>  
	
	<div class="content">
		<h1>Novo Evento</h1>
		
		{% ifequal action "Edit" %}
			<h4>{{ event.title }}</h4>
			<h6>{{ event.description }}</h6>
			<h5>{{ event.creator }}</h5>
		{% endifequal %}
	
		{% if event_form.errors %}
			<p style="color:red;"> Algum erro.</p>
		{% endif %}

		{% ifequal events_count 0 %}
			<p>Não há eventos no dia selecionado. Para inserir um novo evento para este dia, preencha os campos abaixo.</p>
			<p>Caso queira adicionar um evento em outro dia, clique na opção Alterar Data no menu lateral para fazer uma nova busca.</p>
		{% endifequal %}
				
		<form action="" method="post">
			<input type="hidden" name="action" id="action" value="{{action}}" />
			<table class="event_form">
				{{ event_form.as_table }}
	
				{% ifnotequal action "Edit" %}
					<tr>
						<th>Data:</th>
						<td>{{date}}</td>
					</tr>
			
					<script>
						$("#id_date").parent().parent().hide();
						$("#id_date").attr("value", '{{date}}');
					</script>
				{% endifnotequal %}
			</table>
			{% ifequal action "Edit" %}
				<script>
					$("#id_title").attr("value", '{{event.title}}');
					$("#id_description").attr("value", '{{event.description}}');
					$("#id_date").attr("value", '{{date}}');
					$("#id_date").datepicker({dateFormat: 'dd/mm/yy'});
				</script>
			{% endifequal %}

			{% ifequal action "Add" %}
				<input type="submit" value="Adicionar" class="button" />
			{% else %}
				<input type="submit" value="Editar" class="button" id="edit_event_btn"/>
			{% endifequal %}

		</form>	
	</div>
{% endblock %}
